<template>
  <div>
    <div class="con_head">
      <div class="head_title">{{ post_data.post_title }}</div>
      <div class="head_time litte_font14">
        <div>{{ post_data.published_time }}</div>
        <!-- <div> &nbsp;&nbsp; {{user.user_nickname}}</div> -->
        <div>&nbsp;&nbsp;</div>
      </div>
    </div>

    <wxParse :content="article" />
    <div style="height: 120rpx"></div>
    <div class="footer acea-row row-start-wrapper">
      <div class="item" @click="shouCang">
        <div class="iconfont icon-icon3" v-if="post_data.userCollect"></div>
        <!-- <div class="iconfont icon-icon3"></div> -->
        <div class="iconfont icon-xihuan" v-else></div>
        <div>收藏</div>
      </div>
      <div class="item">
        <div class="iconfont icon-zan"></div>
        <div>点赞</div>
      </div>
      <div class="item">
        <div class="iconfont icon-share"></div>
        <div>分享</div>
      </div>
    </div>
  </div>
</template>


<script>
import wxParse from "mpvue-wxparse";

export default {
  components: {
    wxParse,
  },
  data() {
    return {
      article: "<div >加载中。。。</div>",
      post_data: {},
      user: {},
      storeInfo: {},
    };
  },
  mounted() {
    console.log(this.$root.$mp.query);
    var id = this.$root.$mp.query.aid;
    var token = wx.getStorageSync("token");
    wx.request({
      url: "https://jinrigaoling.com/api/portal/articles/" + id,
      header: {
        "XX-Token": token,
        "XX-Device-Type": "wxapp",
      },
      success: (res) => {
        this.article =
          '<div style="width:95%;margin:0 auto;">' +
          res.data.data.post_content +
          "</div>";
        this.post_data = res.data.data;
        this.user = res.data.data.user;
        wx.setNavigationBarTitle({
          title: res.data.data.post_title,
        });
        // console.log(this.article);
      },
    });

    wx.showShareMenu();
  },
  onLoad: function (options) {
    wx.setNavigationBarTitle({
      title: "今日高陵",
      success: function (res) {
        // success
      },
    });
  },
  methods: {
    shouCang() {
      var token = wx.getStorageSync("token");
      if (token == "") {
        wx.redirectTo({
          url: "/pages/user_login/main",
        });
        return false;
      }
      console.log("token", token);
      var request_action = "";
      if (this.post_data.userCollect == 1) {
        this.post_data.userCollect = 0;
        request_action = "cancelFavorite";
      } else {
        this.post_data.userCollect = 1;
        request_action = "doFavorite";
      }

      wx.request({
        url:
          "https://jinrigaoling.com/api/portal/articles/" +
          request_action +
          "/id/" +
          this.post_data.id,
        header: {
          "XX-Token": token,
          "XX-Device-Type": "wxapp",
        },
        success: (res) => {
          console.log("shoucang", res);
          // console.log(this.article);
        },
      });
    },
  },
};
</script>


<style scoped>
@import url("~mpvue-wxparse/src/wxParse.css");

.acea-row {
  display: flex;
  flex-wrap: wrap;
}
.acea-row.row-start-wrapper {
  align-items: center;
  justify-content: start;
}
.footer {
  padding: 0 20rpx 0 30rpx;
  position: fixed;
  bottom: 0;
  width: 100%;
  box-sizing: border-box;
  height: 100rpx;
  background-color: #fff;
  z-index: 99;
  border-top: 1rpx solid #f0f0f0;
}
.footer .item {
  font-size: 18rpx;
  color: #666;
  margin-right: 50rpx;
}
.footer .item .iconfont {
  text-align: center;
  font-size: 40rpx;
}
/* .footer .item .iconfont.icon-shoucang1 {color:#f00;} */
.footer .item .iconfont.icon-icon3 {
  color: #f00;
}
.con_head {
  display: flex;
  flex-direction: column;
  /* justify-content: center; */
  background-color: #fff;
  margin-left: 2.5%;
}

.head_title {
  font-size: 48rpx;
}
.head_time {
  display: flex;
  flex-direction: row;
  margin-top: 30rpx;
}
</style>


